import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
const { resolve }  = require('path')

export default defineConfig({
    plugins: [
      vue(),
      AutoImport({
        resolvers: [ElementPlusResolver()],
      }),
      Components({
        resolvers: [ElementPlusResolver()],
      }),
    ],
    resolve: {
        alias: {
            '@': resolve(__dirname, 'src')
        }
    },
    // 引入全局的css
    css: {
        preprocessorOptions: {
            scss: {
                additionalData: '@import "src/styles/variable.scss";'
            }
        }
    },
    build: {
        terserOptions: {
            // 生产时移除console和debugger
            compress: {
                drop_console: true,
                drop_debugger: true
            }
        },
        // 打包时计算文件大小
        reportCompressedSize: true,
        // css代码拆分
        cssCodeSplit: true,
        rollupOptions: {
            manualChunks: {
                'element-plus': ['element-plus']
            },
            output: {
                chunkFileNames: 'js/[name]-[hash].js',
                entryFileNames: 'js/[name]-[hash].js',
                assetFileNames: '[ext]/[name]-[hash].[ext]'
            }
        }
    },
    server: {
        port: 8888,
        proxy: {
            '/api': {
                target: '',
                changeOrigin: true,
                rewrite: (path) => path.replace('/^\/api/', '')
            }
        },
        cors: true
    }
        
})